<#assign pageTitle="我的课程"/>
<#assign pageHeader>
    <link rel="stylesheet" type="text/css" href="/static/h5/css/user.css?20220210"/>
</#assign>
<#assign pageContent>
    <van-nav-bar
            title="我的课程"
            left-text="返回"
            left-arrow
            @click-left="location.href='/user/index.html';"
            fixed
            placeholder
    ></van-nav-bar>
    <div class="main-item mt-12 mb-12">
        <div class="course-card">
            <van-row gutter="24">
                <#if courseList?? && courseList?size gt 0>
                    <#list courseList as item>
                        <van-col span="24">
                            <div class="course-pic">
                                <a href="/course/view/${item.courseId}.html">
                                    <img src="${item.cover}" alt="">
                                </a>
                            </div>
                            <div class="course-info">
                                <div class="course-name text-two">
                                    <a href="/course/view/${item.courseId}.html">
                                        ${item.courseName!}
                                    </a>
                                </div>
                            </div>
                            <div class="course-price">
                                <div class="fl">${item.categoryName!}</div>
                                <div class="fr">¥${item.price/100}</div>
                            </div>
                            <div class="user-course-list">
                                <#if item.courseStudyHistory??>
                                    <span class="fl">章节进度 ：${item.courseStudyHistory.courseName!}</span>
                                    <van-button class="fr" url="/user/course/play.html?nodeId=${item.courseStudyHistory.nodeId!}" type="primary" size="small">继续学习(${item.studyPercent}%)</van-button>
                                <#else>
                                    <span class="fl">章节进度 ：无</span>
                                    <van-button class="fr" url="/user/course/play.html?courseId=${item.courseId!}" type="primary" size="small">开始学习(${item.studyPercent}%)</van-button>
                                </#if>
                            </div>
                        </van-col>
                    </#list>
                </#if>
            </van-row>
        </div>
        <van-empty description="您还没有学习过课程..." v-if="pageCount == 0"></van-empty>
        <div style="padding: 0 12px"  v-if="pageCount == 0"><van-button  type="info" size="large" url="/course/pro/list.html">开始学习</van-button></div>
    </div>
    <van-pagination v-model="currentPage" :page-count="pageCount" v-if="pageCount != 0" mode="simple"  class="mb-12 pd-12" @change="pageChange"></van-pagination>
</#assign>
<#assign pageScript>
    <script>
        var pageCount = ${totalPages};
        var currentPage = ${page.currentPage};
        new Vue({
            el: '#app',
            data() {
                return {
                    showFooter: false,
                    pageCount : pageCount,
                    currentPage: currentPage
                }
            },
            methods: {
                pageChange(value) {
                    window.location.href = '/user/course/list.html?page=' + value;
                },
            }
        })
    </script>
</#assign>
<#include "../layout_h5.ftl" />